<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <!-- <script>
    function red(){
      console.log("red")
    }
    function yellow(){
      console.log("yellow")
    }
    function green(){
      console.log("green")
    }
    function light(delay, fn){
      return new Promise((resolve,reject)=>{
        setTimeout(() => {
          fn()
          resolve()
        }, delay);
      })
    }
    function step(){
      // light(1000,green).then(()=>{
      //   light(2000,yellow).then(()=>{
      //     light(3000,red)
      //   })
      // })
      Promise.resolve().then(()=>{
        return light(1000,green)
      }).then(()=>{
        return light(1000,yellow)
      }).then(()=>{
        return light(1000,red)
      }).then(()=>{
        step()
      })
    }
    step()
  </script> -->


  <!-- <script>
    const frist = ()=>( new Promise((resolve, reject)=>{ // 2、进入函数
      console.log(3) //3、打印3
      let p = new Promise((resolve,reject)=>{ //4、直接进入
        console.log(7) //5、打印7
        setTimeout(() => {  //6、settimeout放进宏任务
          console.log(5) //14、打印5
          resolve(6) //15、p状态已解决 忽略
          console.log(p)  //16、打印 p 对象
        }, 0);
        resolve(1) //7、执行resolve p状态变为已解决 value为1
      })
      resolve(2) //8、执行resolve frist状态变为已解决 value为2
      p.then((arg)=>{  //9、then放进 微任务 列表
        console.log(arg)  //12、执行微任务 打印1
      })
    }))

    frist() // 1、函数调用
    .then((arg)=>{  //10、then放进 微任务 列表
      console.log(arg) //13、执行微任务 打印2 微任务完成 执行下一个宏任务
    })
    console.log(4) // 11、打印4 宏任务完成执行微任务

    //3 7 4 1 2 5 p
    // 宏任务->微任务->下一个宏任务
  </script> -->

  <script>
    async function async1(){
      console.log("async1 start")
      await async2()
      console.log("async1 end")
    }
    async function async2(){
      console.log("async2")
    }
    console.log("script start")
    setTimeout(() => {
      console.log("setTimeout")
    }, 0);
    async1()
    new Promise(function(resolve){
      console.log("promise1")
      resolve()
    }).then(function(){
      console.log("promise2")
    })
    console.log("script end")
  </script>
  
</body>

</html>